<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}

			label {
				position: relative;
				float: left;
				width: 200px;
				height: 200px;
				border: 2px solid;
				overflow: hidden;
				border-radius: 50%;
			}

			input {
				position: absolute;
				left: -200px;
			}

			input:checked~span {
				float: left;
				width: 100%;
				height: 100%;
				background: deeppink;
			}
		</style>
	</head>
	<body>
		<label>
			<input type="radio" name="tab" id="" value="" />
			<span></span>
		</label>
		<label>
			<input type="radio" name="tab" id="" value="" />
			<span></span>
		</label>
		<label>
			<input type="radio" name="tab" id="" value="" />
			<span></span>
		</label>
	</body>
</html>
